import { doRobotPolicyEdit, fetchRobotPolicyInfo } from "@/services/robotManagement";
import { Button, Divider, Form, message, Switch,Slider, InputNumber, Input,Tooltip,Icon } from "antd";
import React from "react";
import { formatMessage } from 'umi-plugin-react/locale';

class PolicySetting extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      detail:{}
    }
  }

  componentDidMount(){
    this.getPolicyInfo()
  }

  getPolicyInfo = async () => {
    const { robotId,applicationId } = this.props;
    const res = await fetchRobotPolicyInfo({applicationId})
    this.props.form.setFieldsValue({
      chat:res.chat,
      bertMatchThreshold:res.bertMatchThreshold,
      documentSearchThreshold:res.documentSearchThreshold,
      documentSearchNums:res.documentSearchNums,
      unknownQuestionReply:res.unknownQuestionReply,
      paraShowFlag:res.paraShowFlag,
      paraShowJiafangAdminFlag:res.paraShowJiafangAdminFlag,
      paraShowJiafangFlag:res.paraShowJiafangFlag
    })
    this.setState({
      detail:res
    })
  }

  doSaveForm = () => {
    this.props.form.validateFields(async (error,values) => {
      if(!error){
        const { detail } = this.state;
        let obj = {...values,id:detail.id}
        const res = await doRobotPolicyEdit(obj)
        message.info(res.message);
      }
    })
  }

  render(){
    const formItemLayout = {
			labelCol: { span: 5 },
			wrapperCol: { span: 17 },
		};
    const { getFieldDecorator,getFieldValue } = this.props.form;
    const renderLabel = (label,tips) => (
      <Tooltip title={tips}>
        <span>{label}<Icon type="question-circle-o" style={{marginLeft:2}} /></span>
      </Tooltip>
    )
    return(
      <div>
        <Form {...formItemLayout} className='robot-setting-form'>  
          <Form.Item label={renderLabel(formatMessage({ id: 'knowledgeConfig.bertMatchThreshold' }), formatMessage({ id: 'knowledgeConfig.bertMatchThresholdTooltip' }))}>
              {
                getFieldDecorator("bertMatchThreshold")(
                  <Slider
                    min={0}
                    max={1}
                    step={0.01}
                    style={{width:300,display:"inline-block",marginRight:15,verticalAlign:"middle"}}
                  />
                )
              }
              <span>{getFieldValue('bertMatchThreshold')}</span>
            </Form.Item>
            <Divider style={{marginTop:0}} />
            <Form.Item label={renderLabel(formatMessage({ id: 'knowledgeConfig.documentSearchThreshold' }), formatMessage({ id: 'knowledgeConfig.documentSearchThresholdTooltip' }))}>
              {
                getFieldDecorator("documentSearchThreshold")(
                  <Slider
                    min={0}
                    max={1}
                    step={0.01}
                    style={{width:300,display:"inline-block",marginRight:15,verticalAlign:"middle"}}
                  />
                )
              }
              <span>{getFieldValue('documentSearchThreshold')}</span>
            </Form.Item>
            <Form.Item label={renderLabel(formatMessage({ id: 'knowledgeConfig.documentSearchNums' }), formatMessage({ id: 'knowledgeConfig.documentSearchNumsTooltip' }))}>
              {
                getFieldDecorator("documentSearchNums")(
                  <InputNumber min={2} max={99} precision={0} />
                )
              }
            </Form.Item>
            <Form.Item label={formatMessage({ id: 'knowledgeConfig.paraShowFlag' })}>
              <Form.Item style={{display:"inline-block",marginBottom:0,paddingTop:6}}>
                <label>{formatMessage({ id: 'knowledgeConfig.jiafangFlag' })}：</label>
                {
                  getFieldDecorator("paraShowJiafangFlag",{initialValue:false,valuePropName: 'checked'})(
                    <Switch />
                  )
                }
              </Form.Item>
              <Form.Item style={{display:"inline-block",marginBottom:0,marginLeft:10,marginRight:10,paddingTop:6}}>
                <label>{formatMessage({ id: 'knowledgeConfig.jiafangAdminFlag' })}：</label>
                {
                  getFieldDecorator("paraShowJiafangAdminFlag",{initialValue:false,valuePropName: 'checked'})(
                    <Switch />
                  )
                }
              </Form.Item>
              <Form.Item style={{display:"inline-block",marginBottom:0,paddingTop:6}}>
                <label>{formatMessage({ id: 'knowledgeConfig.advisorFlag' })}：</label>
                {
                  getFieldDecorator("paraShowFlag",{initialValue:false,valuePropName: 'checked'})(
                    <Switch />
                  )
                }
              </Form.Item>
            </Form.Item>
            <Divider style={{marginTop:0}} />
            <Form.Item label={renderLabel(formatMessage({ id: 'knowledgeConfig.chatFunction' }))}>
              {
                getFieldDecorator("chat", { valuePropName: 'checked' })(
                  <Switch />
                )
              }
            </Form.Item>
            <Form.Item label={renderLabel(formatMessage({ id: 'knowledgeConfig.unknownQuestionReply' }), formatMessage({ id: 'knowledgeConfig.unknownQuestionReplyTooltip' }))}>
              {
                getFieldDecorator("unknownQuestionReply", { rules: [{ required: true, message: formatMessage({ id: 'knowledgeConfig.unknownQuestionRequired' })}]})(
                  <Input.TextArea placeholder={formatMessage({ id: 'knowledgeConfig.unknownQuestionPlaceholder' })} style={{ width: 300}} maxLength={200} rows={5} />
                )
              }
            </Form.Item>
          
          
          
          
          <Divider style={{marginTop:0}} />
          <Form.Item label={<Button type="primary" onClick={this.doSaveForm}>{formatMessage({ id: 'knowledgeConfig.save' })}</Button>} colon={false}></Form.Item>
        </Form>
        
      </div>
    )
  }
}

export default Form.create()(PolicySetting)